<style>
  .{{$template|escape:'html'}}_table1 {
    width: 900px;
    height: 20px;
    background-color:#ebebe3;
    border-right:solid 1px #ccc;
    border-bottom:solid 1px #ccc;
  }
  .{{$template|escape:'html'}}_table2 {
    width: 900px;
    height: 17px;
  }
  .{{$template|escape:'html'}}_table3 {
    width: 900px;
    height: 22px;
    background-color:#ebebe3;
    border-right:solid 1px #ccc;
    border-bottom:solid 1px #ccc;
  }
  .{{$template|escape:'html'}}_table4 {
    height: 30px;
  }
  .{{$template|escape:'html'}}_table5 {
    width: 850px;
    height: 22px;
    border-left:solid 1px #694247;
    border-top:solid 1px #694247;
  }
  .{{$template|escape:'html'}}_table5 td {
    border-right:solid 1px #694247;
    border-bottom:solid 1px #694247;
  }
  .{{$template|escape:'html'}}_table6 {
    width: 900px;
    height:1px;
    paddingleft:15px
    tex-talign:left;
  }
  .{{$template|escape:'html'}}_td1 {
    width: 900px;
    height: 25px;
    padding-left: 15px;
    font-weight:bold;
    font-size:10pt;
    color: #694247;
    background-image:url(images/common/headline.png);
    background-repeat:repeat-x;
    border-right: solid 1px #8F8F8A;
  }
  .{{$template|escape:'html'}}_td2 {
    width: 100px;
    height: 25px;
    padding-left: 15px;
    font-weight:bold;
    font-weight:bold;
    font-size:10pt;
    color: #694247;
    font-size:10pt;
  }
  .{{$template|escape:'html'}}_td3 {
    width: 195px;
  }
  .{{$template|escape:'html'}}_td4 {
    width: 100px;
    font-weight:bold;
    font-size:10pt;
    font-weight:bold;
    font-size:10pt;
    color: #694247;
    padding-left:95px;
  }
  .{{$template|escape:'html'}}_td5 {
    width: 189px;
  }
  .{{$template|escape:'html'}}_td6 {
    width: 18px;
    height: 23px;
    text-align: left;
  }
  .{{$template|escape:'html'}}_td7 {
    width: 58px;
    height: 23px;
    font-weight:bold;
    font-size:10pt;
    color: #694247;
  }
  .{{$template|escape:'html'}}_td8 {
    width: 93px;
    height: 23px;
    font-weight:bold;
    font-size:10pt;
    color: #694247;
  }
  .{{$template|escape:'html'}}_td9 {
    width: 189px;
    height: 46px;
    TEXT-ALIGN:center;
    vertical-align: bottom;
  }
  .{{$template|escape:'html'}}_td10 {
    width: 900px;
    height: 23px;
    font-weight:bold;
    font-size:11pt;
    color: #fff;
    padding-left:20px;
    background-color:#885b5d;
  }
  .{{$template|escape:'html'}}_td11 {
    width: 110px;
    height: 32px;
    padding:0 20px;
    font-weight:bold;
    font-size:10pt;
    color: #694247;
    text-align:center;
    vertical-align:bottom;
  }
  .{{$template|escape:'html'}}_td12 {
    width: 130px;
    height: 32px;
    text-align:left;
    vertical-align:bottom;
  }
  .{{$template|escape:'html'}}_td13 {
    width: 84px;
    height: 32px;
    font-weight:bold;
    font-size:10pt;
    color: #694247;
    padding:0 38px;
    text-align:center;
    vertical-align:bottom;
  }
  .{{$template|escape:'html'}}_td14 {
    width: 155px;
    height:32px;
    text-align:left;
    vertical-align:bottom;
  }
  .{{$template|escape:'html'}}_td15 {
    width: 120px;
    height: 32px;
    padding:0 15px;
    font-weight:bold;
    font-size:10pt;
    color: #694247;
    text-align:center;
    vertical-align:bottom;
  }
  .{{$template|escape:'html'}}_td16 {
    width: 155px;
    height: 32px;
    text-align:left;
    vertical-align:bottom;
  }
  .{{$template|escape:'html'}}_td17 {
    width: 92px;
    height: 30px;
    font-weight:bold;
    font-size:9pt;
    color: #694247;
    text-align:left;
    padding-left:11px;
    PADDING-BOTTOM:5PX;
    vertical-align:bottom;
  }
  .{{$template|escape:'html'}}_td18 {
    width: 125px;
    height: 30px;
    text-align:left;
    vertical-align:bottom;
    padding: 0 0 2px 3px;
  }
  .{{$template|escape:'html'}}_td50 {
    width: 850px;
    padding: 0 25px;
  }
  .{{$template|escape:'html'}}_td19 {
    width: 86px;
    padding: 0 0 0 20px;
    height:22px
  }
  .{{$template|escape:'html'}}_td20 {
    width: 96px;
    padding: 0 0 0 20px;
  }
  .{{$template|escape:'html'}}_td21 {
    width: 67px;
    text-align: center;
  }
  .{{$template|escape:'html'}}_td22 {
    width: 106px;
    padding: 0 0 0 20px;
  }
  .{{$template|escape:'html'}}_td23 {
    width: 67px;
    padding: 0 0 0 20px;
  }
  .{{$template|escape:'html'}}_td19,.{{$template|escape:'html'}}_td20,.{{$template|escape:'html'}}_td21,
  .{{$template|escape:'html'}}_td22,.{{$template|escape:'html'}}_td23 {
    font-weight:bold;
    font-size:10pt;
    color: #694247;
  }
  
  .{{$template|escape:'html'}}_Text {
    width:195px;
    height:18px;
    border-right: solid 1px #fff;
    border-bottom: solid 1px #fff;
    border-left:solid 1px #d2c4b9;
    border-top:solid 1px #d2c4b9;
  }
  .{{$template|escape:'html'}}_Text2 {
    width:70px;
    height:18px;
    border-right: solid 1px #fff;
    border-bottom: solid 1px #fff;
    border-left:solid 1px #d2c4b9;
    border-top:solid 1px #d2c4b9;
  }
  .{{$template|escape:'html'}}_select {
    width:197px;
    height:22px;
    border-right: solid 1px #fff;
    border-bottom: solid 1px #fff;
    border-left:solid 1px #d2c4b9;
    border-top:solid 1px #d2c4b9;
  }
  .{{$template|escape:'html'}}_btn {
    cursor:pointer;
  }
</style>

<script src="jsrequest.php?script={{$template|escape:'html'}}" type="text/javascript"></script>
<script type="text/javascript">
  <!--
    if (document.addEventListener) {
      document.addEventListener('DOMContentLoaded', init, false);
    }
    window.onload = init;

    function init() {
      if (!document.getElementById || !document.createElement || !arguments || arguments.callee._loaded) {
        return;
      }
      arguments.callee._loaded = true;
      var gui = GuiPageAcctPayment.instance('{{$template|escape:'javascript'}}');
      new HandlePageAcctPayment(gui, JSON.parse('{{$operator|escape:javascript}}'), JSON.parse('{{$now|escape:javascript}}'), JSON.parse('{{$options|escape:javascript}}'));
    }
  //-->
</script>

<div  align="left" style="width:{{$smarty.const.PAGE_WIDTH|escape:'html'}}">
<table class="{{$template|escape:'html'}}_table1" cellPadding="0" cellSpacing="0" border=0>
  <tr>
    <td class="{{$template|escape:'html'}}_td1">
      Search Box
    </td>
  </tr>
  <tr>
    <td class="{{$template|escape:'html'}}_table2">
      <table class="{{$template|escape:'html'}}_table2" cellPaddiing="0" cellSpacing="0" border=0>
        <tr>
          <td style="height:15px" colSpan="6"></td>
        </tr>
        <tr>
          <td class="{{$template|escape:'html'}}_td2">
            <span style="letter-spacing:2px;">C/D</span> From
          </td>
          <td class="{{$template|escape:'html'}}_td3">
            <input type="text" class="{{$template|escape:'html'}}_Text" id="{{$template|escape:'html'}}_cdateFrom_text"></input>
          </td>
          <td class="{{$template|escape:'html'}}_td4">
            <span style="letter-spacing:2px;">C/D</span> To
          </td>
          <td class="{{$template|escape:'html'}}_td3">
            <input type="text" class="{{$template|escape:'html'}}_Text" id="{{$template|escape:'html'}}_cdateTo_text"></input>
          </td>
          <td class="{{$template|escape:'html'}}_td5"></td>
        </tr>
        <tr>
          <td class="{{$template|escape:'html'}}_td2">
            <span style="letter-spacing:2px;">P/D</span> From
          </td>
          <td class="{{$template|escape:'html'}}_td3">
            <input type="text" class="{{$template|escape:'html'}}_Text" id="{{$template|escape:'html'}}_pdateFrom_text"></input>
          </td>
          <td class="{{$template|escape:'html'}}_td4">
            <span style="letter-spacing:2px;">P/D</span> To
          </td>
          <td class="{{$template|escape:'html'}}_td3">
            <input type="text" class="{{$template|escape:'html'}}_Text" id="{{$template|escape:'html'}}_pdateTo_text"></input>
          </td>
          <td class="{{$template|escape:'html'}}_td5"></td>
        </tr>
        <tr>
          <td class="{{$template|escape:'html'}}_td2">
            Payee
          </td>
          <td class="{{$template|escape:'html'}}_td3">
            <input type="text" class="{{$template|escape:'html'}}_Text" id="{{$template|escape:'html'}}_payer_text"></input>
          </td>
          <td class="{{$template|escape:'html'}}_td4">
            Item
          </td>
          <td class="{{$template|escape:'html'}}_td3">
            <select class="{{$template|escape:'html'}}_select" id="{{$template|escape:'html'}}_item_select" ></select>
          </td>
          <td class="{{$template|escape:'html'}}_td5"></td>
        </tr>
        <tr>
          <td class="{{$template|escape:'html'}}_td2">
            Sort
          </td>
          <td class="{{$template|escape:'html'}}_td3">
            <select class="{{$template|escape:'html'}}_select" id="{{$template|escape:'html'}}_sort_select" ></select>
          </td>
          <td class="{{$template|escape:'html'}}_td4">
            Amount
          </td>
          <td class="{{$template|escape:'html'}}_td3">
            <input type="text" class="{{$template|escape:'html'}}_Text" id="{{$template|escape:'html'}}_amount_text"></input>
          </td>
          <td class="{{$template|escape:'html'}}_td9" rowSpan="2">
            <input type="button" class="search" id= "{{$template|escape:'html'}}_search_button" />
          </td>
        </tr>
        <tr>
          <td class="{{$template|escape:'html'}}_td2">
            Method
          </td>
          <td class="{{$template|escape:'html'}}_td3">
            <select class="{{$template|escape:'html'}}_select" id="{{$template|escape:'html'}}_method_select" ></select>
          </td>
          <td class="{{$template|escape:'html'}}_td4"></td>
          <td class="{{$template|escape:'html'}}_td3">
            <table calss="{{$template|escape:'html'}}_td3" cellPaddiing="0" cellSpacing="0" border=0>
              <tr>
                <td class="{{$template|escape:'html'}}_td6">
                  <input type = "checkbox" id="{{$template|escape:'html'}}_verified_checkbox" ></input>
                </td>
                <td class="{{$template|escape:'html'}}_td7">
                  Verified
                </td>
                <td class="{{$template|escape:'html'}}_td6">
                  <input type = "checkbox" id="{{$template|escape:'html'}}_unverified_checkbox" ></input>
                </td>
                <td class="{{$template|escape:'html'}}_td8">
                  Unverified
                </td>
              </tr>
            </table>
          </td>
        </tr>
        <tr>
          <td style="height:15px;"></td>
        </tr>
      </table>
    </td>
  </tr>
</table>
<table cellPadding="0" cellSpacing="0">
  <tr>
    <td style="height:20px;">
  </tr>
</table>
<table class="{{$template|escape:'html'}}_table3" cellPadding="0" cellSpacing="0" border=0>
  <tr>
    <td class="{{$template|escape:'html'}}_td10" colSpan="6">
      Summarize
    </td>
  </tr>
  <tr>
    <td class="{{$template|escape:'html'}}_td11">
      Total Receipts
    </td>
    <td class="{{$template|escape:'html'}}_td12" id="{{$template|escape:'html'}}_receipt_div" ></td>
    <td class="{{$template|escape:'html'}}_td13">
      Total Cash
    </td>
    <td class="{{$template|escape:'html'}}_td14" id="{{$template|escape:'html'}}_cash_div" ></td>
    <td class="{{$template|escape:'html'}}_td15">
      Total Non-Cash
    </td>
    <td class="{{$template|escape:'html'}}_td16" id="{{$template|escape:'html'}}_noncash_div" ></td>
  </tr>
  <tr>
    <td colSpan="4"></td>
    <td colSpan="2">
      <table class="{{$template|escape:'html'}}_table4" cellPadding="0" cellSpacing="0" border=0>
        <tr>
          <td class="{{$template|escape:'html'}}_td17">
            Customer No.
          </td>
          <td style="vertical-align: bottom;padding-bottom:2px">
            <input type="text" class="{{$template|escape:'html'}}_Text2" id="{{$template|escape:'html'}}_cusNo_text"></input>
          </td>
          <td class="{{$template|escape:'html'}}_td18">
            <input type="button" value="Add Payment" id="{{$template|escape:'html'}}_add_button"></input>
          </td>
        </tr>
      </table>
    </td>
  </tr>
  <tr>
    <td id="{{$template|escape:'html'}}_pagination_div" colSpan="6" style="padding-left:27px"></td>
  </tr>
  <tr>
    <td class="{{$template|escape:'html'}}_td50" colSpan="6" style="padding-left:26px">
      <table class="{{$template|escape:'html'}}_table5" id="{{$template|escape:'html'}}_main_table"  cellPadding="0" cellSpacing="0" border=0>
        <tr>
          <td class="{{$template|escape:'html'}}_td19"><span style="letter-spacing:2px;">C/</span>Date</td>
          <td class="{{$template|escape:'html'}}_td19"><span style="letter-spacing:2px;">P/</span>Date</td>
          <td class="{{$template|escape:'html'}}_td20">Payer</td>
          <td class="{{$template|escape:'html'}}_td21">Item</td>
          <td class="{{$template|escape:'html'}}_td19">Sort</td>
          <td class="{{$template|escape:'html'}}_td20">Amount</td>
          <td class="{{$template|escape:'html'}}_td23">Method</td>
          <td class="{{$template|escape:'html'}}_td22">Status</td>
        </tr>
      </table>
    </td>
  </tr>
  <tr>
    <td style="height:20px" colSpan="6"></td>
  </tr>
</table>
</div>
